// components/navigation-bar/index.js
Component({
  options: {
    multipleSlots: true,
  },
  properties: {
    extClass: {
      type: String,
      value: '',
    },
    title: {
      type: String,
      value: '',
    },
    background: {
      type: String,
      value: '',
    },
    color: {
      type: String,
      value: '',
    },
    back: {
      type: Boolean,
      value: true,
    },
    loading: {
      type: Boolean,
      value: false,
    },
    animated: {
      type: Boolean,
      value: true,
    },
    show: {
      type: Boolean,
      value: true,
      observer: '_showChange',
    },
    delta: {
      type: Number,
      value: 1,
    },
  },
  data: {
    displayStyle: '',
  },
  lifetimes: {
    attached() {
      const rect = wx.getMenuButtonBoundingClientRect()
      const windowInfo = wx.getWindowInfo()
      // console.log('attached', rect, windowInfo)
      this.setData({
        statusBarHeight: windowInfo.statusBarHeight,
        innerPaddingRight: `padding-right:${
          windowInfo.windowWidth - rect.left
        }px`,
        leftWidth: `width:${windowInfo.windowWidth - rect.left}px`,
        navBarHeight: rect.bottom + rect.top - windowInfo.statusBarHeight,
      })
    },
  },
  methods: {
    _showChange() {},
    back() {
      const data = this.data
      if (data.delta) {
        wx.navigateBack({
          delta: data.delta,
        })
      }
      this.triggerEvent('back', { delta: data.delta }, {})
    },
  },
})
